<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bookshop</title>

    <!-- Bootstrap -->
    <link href="/assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="/assets/css/font-awesome.min.css" rel="stylesheet">
    <link href="/assets/css/animate.min.css" rel="stylesheet">
    <link href="/assets/css/main.min.css" rel="stylesheet">

    <!-- Favicon -->
    <link rel="shortcut icon" href="/assets/images/favicon.ico">

    <link href='http://fonts.googleapis.com/css?family=PT+Serif:400,700,400italic,700italic' rel='stylesheet'
          type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Fira+Sans:400,300,300italic,400italic,500,500italic,700,700italic'
          rel='stylesheet' type='text/css'>
</head>
<body class="">


<div id="wrapper" class="">
    <div id="page-content-wrapper" class="st-pusher">
        <div class="st-pusher-after"></div>
        <!-- ============================================== HEADER ============================================== -->

        <jsp:include page="header.jsp"/>


        <!-- ============================================== HEADER : END ============================================== -->
        <div class="all-categories content">

            <div class="container">
                <section class="music-categories wow fadeInUp outer-top-vs animated"
                         style="visibility: visible; animation-name: fadeInUp;">
                    <div class="module" id="music-disc">
                        <div class="module-heading home-page-module-heading">
                            <h2 class="module-title home-page-module-title">
                                <span>${category.categoryName}</span>
                            </h2>
                        </div><!-- /.module-heading -->
                        <div class="module-body inner-vs">
                            <div class="row books full-width">
                                <div class="clearfix text-center">
                                    <div class="tab-content m-t-20">

                                            <div role="tabpanel" class="tab-pane active" >
                                                <c:forEach items="${pageInfo.list}" var="book">
                                                <div class="col-md-3 col-sm-4">
                                                    <div class="book">
                                                        <a href="/book/bookDetail?bookId=${book.id}">
                                                            <div class="book-cover">
                                                                <img width="140" height="212"
                                                                     src="http://47.94.10.67/images/${book.imgUrl}" alt="">
                                                            </div>
                                                        </a>
                                                        <div class="book-details clearfix">
                                                            <div class="book-description">
                                                                <h3 class="book-title"><a href="/book/bookDetail?bookId=${book.id}">${book.name}</a>
                                                                </h3>
                                                                <p class="book-subtitle">作者：<a href="/book/bookDetail?bookId=${book.id}">${book.author}</a></p>
                                                            </div>
                                                            <div class="actions">
                                                                <a href="/book/bookDetail?bookId=${book.id}">
                                                                    <span class="book-price price">查看详情</span>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                </c:forEach>
                                            </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="divider">
                            <img class="img-responsive" src="/assets/images/all-categories/shadow_all_categories_02.png"
                                 alt="">
                        </div>
                </section>


            </div><!-- /.container -->

        </div><!-- /.all-categories content -->
        <!-- ============================================== FOOTER ============================================== -->
        <footer class="footer clearfix">
            <div class="margin-top-10">
                <div class="container inner-top-vs">
                    <!-- ============================================== FOOTER-TOP ============================================== -->
                    <div class="row">
                        <div class="col-md-3 col-sm-4">
                            <div class="footer-module">
                                <h4 class="footer-module-title">关于本网站</h4>
                                <div class="footer-module-body m-t-20 clearfix">
                                    <p><span class="pull-left"><img src="/assets/images/footer-logo.png" alt=""
                                                                    width="75" height="75"></span><font
                                            style="vertical-align: inherit;">一个cras
                                        tincidunt，ut tellus et。</font>Gravida
                                        scele risque，ipsum sed iacul is，nunc non namtellus。</font><font
                                                style="vertical-align: inherit;">Placerat sed phasellus，purus purus
                                            elit。</font>Cras ante eros。</font><font
                                                style="vertical-align: inherit;">Erat vel。</font><font
                                                style="vertical-align: inherit;">Donec vestibulum sed，vel euismod
                                            donec。</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-4">
                            <div class="footer-module">
                                <h4 class="footer-module-title"> 分类</h4>
                                <div class="footer-module-body clearfix">
                                    <ul class="list-unstyled link-list">
                                        <li><a href="#">图书</a></li>
                                        <li><a href="#">课本</a></li>
                                        <li><a href="#">Nook书籍</a></li>
                                        <li><a href="#">有声读物</a></li>
                                        <li><a href="#">杂志</a></li>
                                    </ul>

                                    <ul class="list-unstyled link-list">
                                        <li><a href="#">电影</a></li>
                                        <li><a href="#">音乐</a></li>
                                        <li><a href="#">游戏</a></li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-4 clearfix ">
                            <div class="footer-module">
                                <h4 class="footer-module-title"> 信息</h4>
                                <div class="footer-module-body clearfix">
                                    <ul class="list-unstyled link-list">
                                        <li><a href="#">跟踪订单</a></li>
                                        <li><a href="#">交货</a></li>
                                        <li><a href="#">退货政策</a></li>
                                        <li><a href="#">礼品卡</a></li>
                                    </ul>

                                    <ul class="list-unstyled link-list">
                                        <li><a href="#">联系我们</a></li>
                                        <li><a href="#">商店位置</a></li>
                                        <li><a href="#">常问问题</a></li>
                                        <li><a href="#">使用条款</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-12">
                            <div class="footer-module">
                                <h4 class="footer-module-title"> 连</h4>
                                <div class="footer-module-body clearfix">
                                    <ul class="clearfix list-unstyled footer-social-contact">
                                        <li><a href="#" class="fa fa-facebook" title="Facebook的"></a></li>
                                        <li><a href="#" class="fa fa-pinterest" title="Pinterest的"></a></li>
                                        <li><a href="#" class="fa fa-linkedin" title="LinkedIn"></a></li>
                                        <li><a href="#" class="fa fa-twitter" title="推特"></a></li>
                                        <li><a href="#" class="fa fa-google-plus" title="Google Plus"></a></li>
                                        <li><a href="#" class="fa fa-rss" title="RSS"></a></li>
                                        <li><a href="#" class="fa fa-instagram" title="Instagram的"></a></li>

                                    </ul>


                                    <div class="inner-top-xs">
                                        <p>订阅我们的每周时事通讯。</p>
                                        <form class="searchform" action="http://inspectelement.com/" method="get">
                                            <input class="s" type="text" placeholder="Email Address" name="s" value="">
                                           <input class="searchsubmit" type="submit" value="订阅">
                                        </form>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- ============================================== FOOTER-TOP : END ============================================== -->
                    <hr>
                    <!-- ============================================== FOOTER-BOTTOM ============================================== -->
                    <div class="row">
                        <div class="col-md-12">
                            <div class="pull-left">
                                <ul class="payment-list list-unstyled">
                                    <li>
                                        <a href="#">
                                            <img src="/assets/images/payments/1.png" class="img-responsive"
                                                         height="22" alt="">
                                        </a>
                                    </li>

                                </ul>
                            </div>
                            <p class="copyright-footer pull-right">版权所有。由<a
                                    href="#">Heztheme</a>用爱制造</p>
                        </div>
                    </div>
                    <!-- ============================================== FOOTER-BOTTOM : END ============================================== -->
                </div>
            </div>
        </footer>
        <!-- ============================================== FOOTER : END ============================================== -->
    </div><!-- /.st-pusher -->
    <!-- ============================================== TOGGLE RIGHT CONTENT ============================================== -->

    <c:if test="${sessionScope.current_user == null}">
        <jsp:include page="needLogin.jsp"/>
    </c:if>
    <c:if test="${sessionScope.current_user != null}">
        <jsp:include page="content.jsp"/>
    </c:if>

    <!-- ============================================== TOGGLE RIGHT CONTENT : END ============================================== -->


</div><!-- /#wrapper -->

<script src="/assets/js/jquery-1.11.2.min.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script src="/assets/js/bootstrap-hover-dropdown.min.js"></script>
<script src="/assets/js/owl.carousel.min.js"></script>
<script src="/assets/js/perfect-scrollbar.min.js"></script>
<script src="/assets/js/jquery-ui.min.js"></script>
<script src="/assets/js/jquery.customSelect.min.js"></script>
<script src="/assets/js/jquery.easing-1.3.min.js"></script>
<script src="/assets/js/wow.min.js"></script>
<script src="/assets/js/echo.min.js"></script>
<script src="/assets/js/scripts.js"></script>
</body>
</html>
<script type="text/javascript">
    $("#myBook").on('click', '#backBook', function () {
        var bookId = $(this).prevAll("#backBookId").val();
        if (!confirm("确定归还该图书吗？")) {
            return false;
        }
        $.ajax({
            url:'/borrow/backBook?bookId=' + bookId,
            dataType:'JSON',
            type:'GET',
            success:function (result) {
                if (result.code == 200) {
                    alert(result.msg);
                    window.location.reload();
                } else {
                    alert(result.msg)
                    return;
                }
            }
        })
    });
</script>
